<!DOCTYPE html>
<html lang="en">
<head>        
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />    
    <!--[if gt IE 8]>
        <meta http-equiv="X-UA-Compatible" content="IE=edge" />        
    <![endif]-->                
    <title>Images - Aries Premium Admin Template</title>
    <link rel="icon" type="image/ico" href="favicon.ico"/>
    
    <link href="css/stylesheets.css" rel="stylesheet" type="text/css" />
    <!--[if lte IE 7]>
        <link href="css/ie.css" rel="stylesheet" type="text/css" />
        <script type='text/javascript' src='js/plugins/other/lte-ie7.js'></script>
    <![endif]-->    
    <script type='text/javascript' src='js/plugins/jquery/jquery-1.9.1.min.js'></script>
    <script type='text/javascript' src='js/plugins/jquery/jquery-ui-1.10.1.custom.min.js'></script>
    <script type='text/javascript' src='js/plugins/jquery/jquery-migrate-1.1.1.min.js'></script>
    <script type='text/javascript' src='js/plugins/jquery/globalize.js'></script>
    <script type='text/javascript' src='js/plugins/other/excanvas.js'></script>
    
    <script type='text/javascript' src='js/plugins/other/jquery.mousewheel.min.js'></script>
        
    <script type='text/javascript' src='js/plugins/bootstrap/bootstrap.min.js'></script>            
    
    <script type='text/javascript' src='js/plugins/cookies/jquery.cookies.2.2.0.min.js'></script>
    
    <script type='text/javascript' src="js/plugins/uniform/jquery.uniform.min.js"></script>
    
    <script type='text/javascript' src='js/plugins/shbrush/XRegExp.js'></script>
    <script type='text/javascript' src='js/plugins/shbrush/shCore.js'></script>
    <script type='text/javascript' src='js/plugins/shbrush/shBrushXml.js'></script>
    <script type='text/javascript' src='js/plugins/shbrush/shBrushJScript.js'></script>
    <script type='text/javascript' src='js/plugins/shbrush/shBrushCss.js'></script>    
    
    <script type='text/javascript' src='js/plugins/fancybox/jquery.fancybox.pack.js'></script>
    
    <script type='text/javascript' src='js/plugins.js'></script>
    <script type='text/javascript' src='js/charts.js'></script>
    <script type='text/javascript' src='js/actions.js'></script>
    
</head>
<body>    
    <div id="loader"><img src="img/loader.gif"/></div>
    <div class="wrapper">
        
        <div class="sidebar">
            
            <div class="top">
                <a href="index-2.html" class="logo"></a>
                <div class="search">
                    <div class="input-prepend">
                        <span class="add-on orange"><span class="icon-search icon-white"></span></span>
                        <input type="text"/>                                                      
                    </div>            
                </div>
            </div>
            
            <ul class="navigation">            
                <li><a href="index-2.html" class="blblue">Dashboard</a></li>
                <li>
                    <a href="#" class="blyellow">UI Elements</a>
                    <div class="open"></div>
                    <ul>
                        <li><a href="ui.html">UI Elements</a></li>
                        <li><a href="widgets.html">Widgets</a></li>
                        <li><a href="buttons.html">Buttons</a></li>
                        <li><a href="icons.html">Icons</a></li>
                        <li><a href="grid_sys.html">Grid System</a></li>
                    </ul>
                </li>
                <li>
                    <a href="#" class="blgreen">Forms Stuff</a>
                    <div class="open"></div>
                    <ul>
                        <li><a href="forms.html">Form Elements</a></li>
                        <li><a href="validation.html">Validation</a></li>
                        <li><a href="grid.html">Grid</a></li>
                        <li><a href="editor.html">Editors</a></li>  
                        <li><a href="wizard.html">Wizard</a></li>
                    </ul>
                </li>
                <li><a href="statistic.html" class="blred">Statistic</a></li>                
                <li>
                    <a href="#" class="bldblue">Tables</a>
                    <div class="open"></div>
                    <ul>
                        <li><a href="tables.html">Simple</a></li>
                        <li><a href="tables_dynamic.html">Dynamic</a></li>                    
                    </ul>
                </li>
                <li>
                    <a href="#" class="blpurple">Samples</a>
                    <div class="open"></div>
                    <ul>
                        <li><a href="faq.html">FAQ</a></li>
                        <li><a href="invoice.html">Invoice</a></li>
                        <li><a href="login.html">Login</a></li>
                    </ul>                    
                </li>
                <li class="active">
                    <a href="#" class="blorange">Other</a>
                    <div class="open"></div>
                    <ul>
                        <li><a href="files.html">File handling</a></li>
                        <li class="active"><a href="images.html">Images</a></li>
                        <li><a href="typography.html">Typography</a></li>
                        <li><a href="404.html">Error 404</a></li>
                    </ul>
                </li>
            </ul>
            
            <div class="widget">
                <div class="datepicker"></div>
            </div>
            
        </div>
        
        <div class="body">
            
            <ul class="navigation">
                <li>
                    <a href="index-2.html" class="button">
                        <div class="icon">
                            <span class="ico-monitor"></span>
                        </div>                    
                        <div class="name">Dashboard</div>
                    </a>                
                </li>
                <li>
                    <a href="#" class="button yellow">
                        <div class="arrow"></div>
                        <div class="icon">
                            <span class="ico-cog-2"></span>
                        </div>                    
                        <div class="name">UI Elements</div>
                    </a>          
                    <ul class="sub">
                        <li><a href="ui.html">UI Elements</a></li>
                        <li><a href="widgets.html">Widgets</a></li>
                        <li><a href="buttons.html">Buttons</a></li>
                        <li><a href="icons.html">Icons</a></li>
                        <li><a href="grid_system.html">Grid System</a></li>
                    </ul>
                </li>                
                <li>
                    <a href="#" class="button green">
                        <div class="arrow"></div>
                        <div class="icon">
                            <span class="ico-pen-2"></span>
                        </div>                    
                        <div class="name">Forms Stuff</div>
                    </a>                
                    <ul class="sub">
                        <li><a href="forms.html">Elements</a></li>
                        <li><a href="validation.html">Validation</a></li>
                        <li><a href="grid.html">Grid</a></li>
                        <li><a href="editor.html">Editors</a></li>
                        <li><a href="wizard.html">Wizard</a></li>
                    </ul>                    
                </li>                        
                <li>
                    <a href="statistic.html" class="button red">
                        <div class="icon">
                            <span class="ico-chart-4"></span>
                        </div>                    
                        <div class="name">Statistic</div>
                    </a>                
                </li>                
                <li>
                    <a href="#" class="button dblue">
                        <div class="arrow"></div>
                        <div class="icon">
                            <span class="ico-layout-7"></span>
                        </div>                    
                        <div class="name">Tables</div>
                    </a> 
                    <ul class="sub">
                        <li><a href="tables.html">Simple</a></li>
                        <li><a href="tables_dynamic.html">Dynamic</a></li>
                    </ul>                                        
                </li>
                <li>
                    <a href="#" class="button purple">
                        <div class="arrow"></div>
                        <div class="icon">
                            <span class="ico-box"></span>
                        </div>                    
                        <div class="name">Samples</div>
                    </a>   
                    <ul class="sub">
                        <li><a href="faq.html">FAQ</a></li>
                        <li><a href="invoice.html">Invoice</a></li>
                        <li><a href="login.html">Login</a></li>
                    </ul>                                        
                </li>
                <li>
                    <a href="#" class="button orange">
                        <div class="arrow"></div>
                        <div class="icon">
                            <span class="ico-cloud"></span>
                        </div>                    
                        <div class="name">Other</div>
                    </a>                
                    <ul class="sub">
                        <li><a href="files.html">File handling</a></li>
                        <li><a href="images.html">Images</a></li>
                        <li><a href="typography.html">Typography</a></li>
                        <li><a href="404.html">Error 404</a></li>
                    </ul>                                      
                </li>                
                <li>
                    <div class="user">
                        <img src="img/examples/users/dmitry_m.jpg" align="left"/>
                        <a href="#" class="name">
                            <span>Dmitry Ivaniuk</span>
                            <span class="sm">Administrator</span>
                        </a>
                    </div>
                    <div class="buttons">
                        <div class="sbutton green navButton">
                            <a href="#"><span class="ico-align-justify"></span></a>
                        </div>
                        <div class="sbutton blue">
                            <a href="#"><span class="ico-cogs"></span></a>
                            <div class="popup">
                                <div class="arrow"></div>
                                <div class="row-fluid">
                                    <div class="row-form">
                                        <div class="span12"><strong>SETTINGS</strong></div>
                                    </div>                                    
                                    <div class="row-form">
                                        <div class="span4">Navigation:</div>
                                        <div class="span8"><input type="radio" class="cNav" name="cNavButton" value="default"/> Default <input type="radio" class="cNav" name="cNavButton" value="bordered"/> Bordered</div>
                                    </div>                                    
                                    <div class="row-form">
                                        <div class="span4">Content:</div>
                                        <div class="span8"><input type="radio" class="cCont" name="cContent" value=""/> Responsive <input type="radio" class="cCont" name="cContent" value="fixed"/> Fixed</div>
                                    </div>                                    
                                </div>
                            </div>
                        </div>                        
                    </div>
                </li>                
            </ul>
            
            
            <div class="content">
                
                <div class="page-header">
                    <div class="icon">                        
                        <span class="ico-pictures"></span>
                    </div>
                    <h1>Images <small>METRO STYLE ADMIN PANEL</small></h1>
                </div>
                
                <div class="row-fluid">
                    <div class="span6">
                        <div class="block">
                            <div class="head">
                                <div class="icon"><span class="ico-picture"></span></div>
                                <h2>Simple Gallery</h2>                    
                            </div>                           
                            <div class="data-fluid sGallery">
                                <div class="item"><a href="img/examples/photo/example_1.jpg" class="fb" rel="group"><img src="img/examples/photo/example_1.jpg" width="220"/></a></div>
                                <div class="item"><a href="img/examples/photo/example_2.jpg" class="fb" rel="group"><img src="img/examples/photo/example_2.jpg" width="220"/></a></div>
                                <div class="item"><a href="img/examples/photo/example_3.jpg" class="fb" rel="group"><img src="img/examples/photo/example_3.jpg" width="220"/></a></div>
                                <div class="item"><a href="img/examples/photo/example_4.jpg" class="fb" rel="group"><img src="img/examples/photo/example_4.jpg" width="220"/></a></div>
                                <div class="item"><a href="img/examples/photo/example_5.jpg" class="fb" rel="group"><img src="img/examples/photo/example_5.jpg" width="220"/></a></div>
                                <div class="item"><a href="img/examples/photo/example_6.jpg" class="fb" rel="group"><img src="img/examples/photo/example_6.jpg" width="220"/></a></div>
                                <div class="item"><a href="img/examples/photo/example_7.jpg" class="fb" rel="group"><img src="img/examples/photo/example_7.jpg" width="220"/></a></div>
                                <div class="item"><a href="img/examples/photo/example_8.jpg" class="fb" rel="group"><img src="img/examples/photo/example_8.jpg" width="220"/></a></div>
                                <div class="item"><a href="img/examples/photo/example_9.jpg" class="fb" rel="group"><img src="img/examples/photo/example_9.jpg" width="220"/></a></div>
                                <div class="item"><a href="img/examples/photo/example_10.jpg" class="fb" rel="group"><img src="img/examples/photo/example_10.jpg" width="220"/></a></div>
                            </div>
                        </div>     
                    </div>
                    <div class="span6">
                        <div class="block">
                            <div class="head green">
                                <div class="icon"><span class="ico-picture"></span></div>
                                <h2>Images in table</h2>
                            </div>
                            <div class="data-fluid">
                                <table cellpadding="0" cellspacing="0" width="100%" class="table images lcnp">
                                    <thead>
                                        <tr>
                                            <th width="30"><input type="checkbox" class="checkall"/></th>
                                            <th width="60">Image</th>
                                            <th>Name</th>
                                            <th width="100">Date</th>
                                            <th width="60">Size</th>
                                            <th width="80">Actions</th>                                
                                        </tr>
                                    </thead>
                                    <tbody>
                                        <tr>
                                            <td><input type="checkbox" name="checkbox"/></td>
                                            <td><a class="fb" rel="group" href="img/examples/photo/example_1.jpg"><img src="img/examples/photo/example_1s.jpg" class="img-polaroid"/></a></td>
                                            <td class="info"><a class="fb" rel="group" href="img/examples/photo/example_1.jpg">Lorem ipsum dolor sit amet</a> <span>fk-hseosqassr.jpg</span></td>
                                            <td><span>10.11.2012 10:42</span></td>
                                            <td>260 Kb</td>
                                            <td>
                                                <a href="#" class="button green">
                                                    <div class="icon"><span class="ico-pencil"></span></div>
                                                </a>
                                                <a href="#" class="button red">
                                                    <div class="icon"><span class="ico-remove"></span></div>
                                                </a>                                                 
                                            </td>
                                        </tr>
                                        <tr>
                                            <td><input type="checkbox" name="checkbox"/></td>
                                            <td><a class="fb" rel="group" href="img/examples/photo/example_2.jpg"><img src="img/examples/photo/example_2s.jpg" class="img-polaroid"/></a></td>
                                            <td class="info"><a class="fb" rel="group" href="img/examples/photo/example_2.jpg">Lorem ipsum dolor sit amet</a> <span>fk-hseosqassr.jpg</span></td>
                                            <td><span>10.11.2012 10:42</span></td>
                                            <td>260 Kb</td>
                                            <td>
                                                <a href="#" class="button green">
                                                    <div class="icon"><span class="ico-pencil"></span></div>
                                                </a>
                                                <a href="#" class="button red">
                                                    <div class="icon"><span class="ico-remove"></span></div>
                                                </a>                                                 
                                            </td>                                    
                                        </tr>
                                        <tr>
                                            <td><input type="checkbox" name="checkbox"/></td>
                                            <td><a class="fb" rel="group" href="img/examples/photo/example_7.jpg"><img src="img/examples/photo/example_7s.jpg" class="img-polaroid"/></a></td>
                                            <td class="info"><a class="fb" rel="group" href="img/examples/photo/example_7.jpg">Lorem ipsum dolor sit amet</a> <span>fk-hseosqassr.jpg</span></td>
                                            <td><span>10.11.2012 10:42</span></td>
                                            <td>260 Kb</td>
                                            <td>
                                                <a href="#" class="button green">
                                                    <div class="icon"><span class="ico-pencil"></span></div>
                                                </a>
                                                <a href="#" class="button red">
                                                    <div class="icon"><span class="ico-remove"></span></div>
                                                </a>                                                 
                                            </td>                                    
                                        </tr>
                                        <tr>
                                            <td><input type="checkbox" name="checkbox"/></td>
                                            <td><a class="fb" rel="group" href="img/examples/photo/example_4.jpg"><img src="img/examples/photo/example_4s.jpg" class="img-polaroid"/></a></td>
                                            <td class="info"><a class="fb" rel="group" href="img/examples/photo/example_4.jpg">Lorem ipsum dolor sit amet</a> <span>fk-hseosqassr.jpg</span></td>
                                            <td><span>10.11.2012 10:42</span></td>
                                            <td>260 Kb</td>
                                            <td>
                                                <a href="#" class="button green">
                                                    <div class="icon"><span class="ico-pencil"></span></div>
                                                </a>
                                                <a href="#" class="button red">
                                                    <div class="icon"><span class="ico-remove"></span></div>
                                                </a>                                                 
                                            </td>                                    
                                        </tr>
                                        <tr>
                                            <td><input type="checkbox" name="checkbox"/></td>
                                            <td><a class="fb" rel="group" href="img/examples/photo/example_5.jpg"><img src="img/examples/photo/example_5s.jpg" class="img-polaroid"/></a></td>
                                            <td class="info"><a class="fb" rel="group" href="img/examples/photo/example_5.jpg">Lorem ipsum dolor sit amet</a> <span>fk-hseosqassr.jpg</span></td>
                                            <td><span>10.11.2012 10:42</span></td>
                                            <td>260 Kb</td>
                                            <td>
                                                <a href="#" class="button green">
                                                    <div class="icon"><span class="ico-pencil"></span></div>
                                                </a>
                                                <a href="#" class="button red">
                                                    <div class="icon"><span class="ico-remove"></span></div>
                                                </a>                                                 
                                            </td>                                    
                                        </tr>                                              
                                    </tbody>
                                </table>                                                 
                            </div>
                        </div>
                        
                    </div>
                </div>
                
                <div class="row-fluid">
                    
                    <div class="span12">
                        <div class="block">
                            <div class="head">
                                <div class="icon"><span class="ico-pictures"></span></div>
                                <h2>Highly customizable</h2>
                            </div>
                            <div class="data-fluid thumbs">
                                <div class="thumbnail">
                                    <a class="fb" rel="group" href="img/examples/photo/example_1.jpg"><img src="img/examples/photo/example_1s.jpg" class="img-polaroid"/></a>
                                    <div class="caption">
                                        <h3>Thumbnail label</h3>
                                        <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                        <p><a class="btn btn-warning" href="#">Action</a> <a class="btn" href="#">Action</a></p>
                                    </div>
                                </div>                        

                                <div class="thumbnail">
                                    <a class="fb" rel="group" href="img/examples/photo/example_2.jpg"><img src="img/examples/photo/example_2s.jpg" class="img-polaroid"/></a>
                                    <div class="caption">
                                        <h3>Thumbnail label</h3>
                                        <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                        <p><a class="btn btn-warning" href="#">Action</a> <a class="btn" href="#">Action</a></p>
                                    </div>
                                </div>                        

                                <div class="thumbnail">
                                    <a class="fb" rel="group" href="img/examples/photo/example_3.jpg"><img src="img/examples/photo/example_3s.jpg" class="img-polaroid"/></a>
                                    <div class="caption">
                                        <h3>Thumbnail label</h3>
                                        <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                        <p><a class="btn btn-warning" href="#">Action</a> <a class="btn" href="#">Action</a></p>
                                    </div>
                                </div>                            

                                <div class="thumbnail">
                                    <a class="fb" rel="group" href="img/examples/photo/example_4.jpg"><img src="img/examples/photo/example_4s.jpg" class="img-polaroid"/></a>
                                    <div class="caption">
                                        <h3>Nonstandard example</h3>
                                        <p>I'm so lonely in this grid :(</p>
                                        <p><a class="btn btn-warning" href="#">Action</a> <a class="btn" href="#">Action</a></p>
                                    </div>
                                </div>                                                        

                                <div class="thumbnail">
                                    <a class="fb" rel="group" href="img/examples/photo/example_5.jpg"><img src="img/examples/photo/example_5s.jpg" class="img-polaroid"/></a>
                                    <div class="caption">
                                        <h3>Thumbnail label</h3>
                                        <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                        <p><a class="btn btn-warning" href="#">Action</a> <a class="btn" href="#">Action</a></p>
                                    </div>
                                </div>                        

                                <div class="thumbnail">
                                    <a class="fb" rel="group" href="img/examples/photo/example_6.jpg"><img src="img/examples/photo/example_6s.jpg" class="img-polaroid"/></a>
                                    <div class="caption">
                                        <h3>Thumbnail label</h3>
                                        <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                        <p><a class="btn btn-warning" href="#">Action</a> <a class="btn" href="#">Action</a></p>
                                    </div>
                                </div> 

                                <div class="thumbnail">
                                    <a class="fb" rel="group" href="img/examples/photo/example_7.jpg"><img src="img/examples/photo/example_7s.jpg" class="img-polaroid"/></a>
                                    <div class="caption">
                                        <h3>Thumbnail label</h3>
                                        <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                        <p><a class="btn btn-warning" href="#">Action</a> <a class="btn" href="#">Action</a></p>
                                    </div>
                                </div>                        

                                <div class="thumbnail">
                                    <a class="fb" rel="group" href="img/examples/photo/example_8.jpg"><img src="img/examples/photo/example_8s.jpg" class="img-polaroid"/></a>
                                    <div class="caption">
                                        <h3>Thumbnail label</h3>
                                        <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                        <p><a class="btn btn-warning" href="#">Action</a> <a class="btn" href="#">Action</a></p>
                                    </div>
                                </div>                            

                                <div class="thumbnail">
                                    <a class="fb" rel="group" href="img/examples/photo/example_9.jpg"><img src="img/examples/photo/example_9s.jpg" class="img-polaroid"/></a>
                                    <div class="caption">
                                        <h3>Thumbnail label</h3>
                                        <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                        <p><a class="btn btn-warning" href="#">Action</a> <a class="btn" href="#">Action</a></p>
                                    </div>
                                </div>                        

                                <div class="thumbnail">
                                    <a class="fb" rel="group" href="img/examples/photo/example_10.jpg"><img src="img/examples/photo/example_10s.jpg" class="img-polaroid"/></a>
                                    <div class="caption">
                                        <h3>Thumbnail label</h3>
                                        <p>Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
                                        <p><a class="btn btn-warning" href="#">Action</a> <a class="btn" href="#">Action</a></p>
                                    </div>
                                </div>  
                                
                            </div>
                        </div>
                        
                    </div>                    
                </div>
                
            </div>
            
        </div>
        
    </div>
    <div class="dialog" id="source" style="display: none;" title="Source"></div>    
</body>
</html>
